<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>明理苑实习项目1——电子时钟</title>
    <link rel="stylesheet" href="style.css">
    <link rel="stylesheet" href="http://at.alicdn.com/t/font_2291224_y9lnojgrqfe.css">
</head>

<body>
    <div class="wrapper">

        <!-- 时钟部分 -->
        <div class="clock">
            <div class="top clearfix">
                <span class="title">中国首都北京时间</span>
                <div class="mode">
                    <div class="switch">
                        <input id="mode-switch" class="mode-switch" type="checkbox">
                        <label for="mode-switch"></label>
                    </div>
                    <span class="off">12小时制</span>
                </div>
                <div class="area-select">
                    <select name="area">
                        <option value="china" selected>中国</option>
                        <!-- <option value="america">美国</option> -->
                    </select>
                </div>
            </div>
            <div class="main clearfix">
                <div class="loading"></div>
                <!-- <div class="timebox">
                    <span class="small">AM</span>
                    <span class="hour">00</span>
                    <span>:</span>
                    <span class="minute">00</span>
                    <span class="second small">00</span>
                </div>
                <div class="datebox">
                    <span class="week">星期一</span>
                    <span class="date">2020年02月02日</span>
                </div> -->
            </div>
            <div class="bottom clearfix">
                <!-- <span class="compare">比北京慢13小时</span>
                <span>北京时间</span>
                <span class="bjtime">17:36:45</span>
                <span class="bjdate">星期四，12月24日</span> -->
            </div>

        </div>

        <!-- 天气部分 -->
        <div class="weather">
            <ul class="clearfix">
                <!-- <li class="loading">loading</li> -->
                <!-- <li>
                    <span class="city">海珠区</span>
                    <i class="iconfont icon-qing2"></i>
                    <span class="status">晴</span>
                    <span class="temp">16℃</span>
                </li> -->
            </ul>
        </div>
    </div>

    <script src="main.js"></script>
</body>

</html>